import React from 'react'
import './autherCom.scss'
import AreaData from "../../../component/areaData/areaData"
import utils from '../../../utils/utils'
import cookie from 'react-cookies'
import moment from 'moment'
import { List, Tabs, Row, Col,Select,DatePicker,Table,Button,Input,Card,Image,Descriptions,Switch,Checkbox ,Modal, message} from 'antd';
import BreadcrumbNav from '../../../component/breadcrumb/breadcrumb'
import { EditOutlined, DeleteOutlined ,SettingOutlined,LoadingOutlined, PlusOutlined ,UploadOutlined} from '@ant-design/icons';
import {getUserPositionInfo,addUserAndAuthority,updUserAndAuthority,getAllAccounnt} from '../../../api/accountManage'
import {getDepartmentList,getPositionByDepartId,getPositionAuthorityList,addDepartment,addPosition,delDepartment,delPosition,updDepartment,updPosition} from '../../../api/account'
import {getProjectInfo} from '../../../api/hardwareCenter'
import {getMenu,getAllMenu} from '../../../api/accountManage'

const { Column } = Table;
const { Option } = Select;
const CheckboxGroup = Checkbox.Group;
class autherCom extends React.Component{
    constructor(props){
        super(props)
        this.state = {
            dataSource : [
            
            ],
            industryjobBox: false,
            department:'',
            newdepartname:'',
            isModalVisibleEdit:false,//修改部门
            isModalVisibleEdit2:false,//修改岗位
            activeStatus:1,//当前状态：1，不编辑 2，编辑
            positionData:[],
            partData:[],
            depart_id:'',
            position_id:'',
            cardData:[],
            new_depart_name:'',//新建的部门名称
            active:'',//标记
            authData:[],//权限
            industryList:[],
            industryBox:false,
            ah_list:[],
            ah_check_name:[],
            allDepartment:[],
            delId:'',
            checkJobBox: false,
            isDelDepart:false,
            ah_list_tmp: [
                {
                    one: {
                        isChecked: false,
                        value:  '一级1',
                    },
                    lt: [{
                        id: 1,
                        label: '二级1',
                        value: '二级1',
                    },{
                        id: 2,
                        label: '二级2',
                        value: '二级2',
                    },],
                    ck_lt: [],
                },{
                    one: {
                        isChecked: false,
                        value:  '一级2',
                    },
                    lt: [{
                        id: 1,
                        label: '二级1',
                        value: '二级1',
                    },{
                        id: 2,
                        label: '二级2',
                        value: '二级2',
                    },],
                    ck_lt: [],
                    
                    
                }],
                editName:'',
                type:'',
                activeName:'',
                activeAuth:'',
                menuid:'',
                newPositionName:'',
                editId:''
        }
    }

    componentDidMount(){
        this.getDepartmentList()
        this.getPositionAuthorityList()//所有部门
    }

    // 点击查询按钮
    searchBtn = () => {
        console.log(this.state.depart_id,this.state.position_id)
        this.getPositionAuthorityList()
    }
    // 点击重置按钮
    clearBtn = () => {
        window.location.reload()
    }

    // 获取部门下的岗位信息
    getPositionAuthorityList = () =>{
        let post_data = {
            'auth_token':cookie.load('station_console_setting_web_login').auth_token,
            'depart_id':this.state.depart_id,
            'position_id':this.state.position_id
        }
        console.log('获取部门下的岗位信息',post_data)
        getPositionAuthorityList(post_data).then(res => {
            if(res.code == 0){
                this.setState({
                    cardData:res.data
                })
            }
        })
        
    }

    // 新建用户-获取部门
    getDepartmentList = () => {
        let post_data = {
            auth_token:cookie.load('station_console_setting_web_login').auth_token
        }
        getDepartmentList(post_data).then(res => {
            if(res.code == 0){
               this.setState({
                   partData:res.data
               })
            }
        })
    }
    // 选中岗位
    selected = (val) => {
        console.log(val,'parttt')
        this.setState({
            depart_id:val.value,
            depart_name:val.label
        },()=>{
            let post_data = {
                auth_token:cookie.load('station_console_setting_web_login').auth_token,
                depart_id:this.state.depart_id
            }
            getPositionByDepartId(post_data).then(res => {
                if(res.code == 0){
                    this.setState({
                        positionData:res.data
                    })
                }
            })
        })
        
    }
    // 选中部门
    selected2 = (val) => {
        console.log(val,'posss')
       
        this.setState({
            position_id:val.value,
            position_name:val.label
        })
        
    }

    //点击 新建部门
    addPart = () => {

        this.setState({
            isModalVisible:true
        })

    }
    

    //点击 新建岗位职位
    // addPost = () => {
        
    //     getUserMenu(post_data).then(res => {
    //         if(res.code == 0){
    //             this.setState({
    //                 isModalVisible2:true,
    //                 authData:res.data
    //             })
    //         }
    //     })
        

    // }
    // 全部权限列表
    // wwwww
    getPosToMenu() {
        let _this = this;
        let { auth_token ,menuid } = _this.state;

        let post_data = {
            auth_token:cookie.load('station_console_setting_web_login').auth_token
        }
        getAllMenu(post_data).then(res => {

            let mt = res.data;
            mt.forEach((val, ind) => {
                val['ck_lt'] = [];
                if(1 == val.default_selected){
                    val['ck_lt'].push(val.id)
                }
                if(val.children && val.children.length > 0){
                    val.children.map((value, index) => {
                        if(1 == value.default_selected){
                            val['ck_lt'].push(value.id)
                        }
                    })
                }
            });
            _this.setState({
                ah_list: mt
            })
            
        })
    }
    getPosToMenu2() {
        let _this = this;
        let post_data = {
            auth_token:cookie.load('station_console_setting_web_login').auth_token
        }

        getAllMenu(post_data).then(res => {

            let mt = res.data;
            console.log('mt',mt)
            console.log('menuid',this.state.menuid)
            mt.forEach((val, ind) => {
                val.ck_lt = [];
                if(this.state.menuid){
                    this.state.menuid.map((e,i)=>{
                    
                    
                        if(val.id == e){
                            console.log('同')
                            val.ck_lt.push(e)
                        }
                        if(val.children && val.children.length > 0){
                            val.children.map((item,index)=>{
                                if(item.id == e){
                                    console.log('同子')
                                    val.ck_lt.push(e)
                                }
                            })
                        }
                        
                    })
                }
               
                
            });
            _this.setState({
                ah_list: mt
            },()=>{
                // wwwww
                console.log('ah_list',this.state.ah_list)
                console.log(this.state.menuid.includes('2'))
            })
            
        })
    }
    // 新建岗位/职务弹窗
    // wwwww
    industryjobBoxOk(e) {
        console.log(e);

        let _this = this;
        let { jobNameCreate, industryCreate, jobNameChange, jobType, ah_list } = _this.state;
        let ah_check_list = new Array();
        let ah_check_name = new Array();

        ah_list.map((val, ind) => {
            if(1 == val.default_selected){
                ah_check_list.push(val.id);
                ah_check_name.push(val.menu_name)
            }
            if(val.children && val.children.length > 0){
                val.children.forEach((v, index) => {
                    if(1 == v.default_selected){
                        ah_check_list.push(v.id);
                        ah_check_name.push(v.menu_name);
                    }
                })
            }
        })

        _this.setState({
            ah_check_list,
            ah_check_name,
        },()=>{
            console.log(this.state.ah_check_list,this.state.ah_check_name)
        })

        if(!jobNameCreate){  message.warning('请填写岗位/职务名称', 2); return; }
        if(!industryCreate){  message.warning('请选择归属部门', 2); return; }
        // if(!jobType){  message.warning('请选择职务性质', 2); return; }
        if(ah_check_list.length == 0){  message.warning('请选择岗位/职务权限', 2); return; }
    
        _this.setState({
            industryjobBox: false,
            checkJobBox: true,
        });
      
    }
    // 修改岗位成功
    editOk = (e) => {
        console.log(e);

        let _this = this;
        let { newPositionName, industryCreate, jobNameChange, jobType, ah_list } = _this.state;
        let ah_check_list = new Array();
        let ah_check_name = new Array();

        ah_list.map((val, ind) => {

            if(val.ck_lt&&val.ck_lt !=[]&&val.ck_lt.length  ){
                ah_check_list.push(val.ck_lt); 
                ah_check_name.push(val.menu_name)
            }
            // if(val.children && val.children.length > 0){
            //     val.children.forEach((v, index) => {
            //         if(v.ck_lt != [] && v.ck_lt.length > 0){
            //             ah_check_list.push(v.ck_lt);
            //             ah_check_name.push(v.menu_name);
            //         }
            //     })
            // }
        })

        _this.setState({
            ah_check_list,
            ah_check_name,
        },()=>{
            console.log('修改',this.state.ah_check_list,this.state.ah_check_name,newPositionName)
        })

        //  if(!newPositionName){  message.warning('请填写新岗位/职务名称', 2); return; }
        
        // if(!jobType){  message.warning('请选择职务性质', 2); return; }
        if(ah_check_list.length == 0){  message.warning('请选择岗位/职务权限', 2); return; }
        
        // _this.setState({
        //     industryjobBox: false,
            
        // });
        let post_data = {
            'auth_token':cookie.load('station_console_setting_web_login').auth_token,
            'position_id':this.state.editId,
            'position_name':this.state.newPositionName,
            'opt_type':2,
            'menu_id':ah_check_list.join(','),

        }
        console.log(post_data)
        updPosition(post_data).then(res => {
            if(res.code == 0){
                message.success('修改部门名称成功！',2,()=> {
                    window.location.reload()
                    this.setState({
                        industryjobBox:false
                    })
                })
            }
        })
        
    }
    onCheckAllChange(ind, e) {
        let _this = this;
        // console.log(e.target.checked)
        let flag = e.target.checked;
        let { ah_list } = _this.state;
        
    
        if(flag){
            if(!ah_list[ind].ck_lt.includes(ah_list[ind].id)){
                ah_list[ind].ck_lt.push(ah_list[ind].id);
            }
        }else {
            if(ah_list[ind].ck_lt.includes(ah_list[ind].id)){
                ah_list[ind].ck_lt.splice(ah_list[ind].ck_lt.indexOf(ah_list[ind].id), 1);
            }
        }

        if(ah_list[ind].children && ah_list[ind].children.length > 0){
            let ah_list_children = ah_list[ind].children;
            ah_list_children.map((val, index) => {
                if(1 != val.can_not_change){
                    if(flag){
                        val.default_selected = '1';
                        if(!ah_list[ind].ck_lt.includes(val.id)){
                            ah_list[ind].ck_lt.push(val.id);
                        }
                    }else {
                        val.default_selected = '0';
                        ah_list[ind].ck_lt.splice(ah_list[ind].ck_lt.indexOf(val.id), 1);
                    }
                }
            })
        }

        ah_list[ind].default_selected = flag ? 1 : 0;
        _this.setState({
            ah_list,
        })
    }
    // 新增部门及岗位/职务 start ===========
    onChangeget(ind, list) {        
        let _this = this;
        let { ah_list } = _this.state;

        ah_list[ind].ck_lt = list;

        if(ah_list[ind].children){
            ah_list[ind].children.map((val, ind) => {
                if(list){
                    if(list.includes(val.id)){
                        val.default_selected = 1;
                    }else {
                        val.default_selected = 0;
                    }
                }
            })
        }

        if(list.length > 0){
            ah_list[ind].default_selected = 1;

            if(!ah_list[ind].ck_lt.includes(ah_list[ind].id)){
                ah_list[ind].ck_lt.push(ah_list[ind].id);
            }
        }else {
            ah_list[ind].default_selected = 0;
        }
        _this.setState({
            ah_list: ah_list
        })
    }
    // 新建部门
    industryOk(str) {
        let _this = this;
        let { ctIndustry, auth_token } = _this.state;
        if(!ctIndustry){
            message.info('请输入部门名称', 2); return;
        }

        let post_data = {
           'auth_token':cookie.load('station_console_setting_web_login').auth_token,
           
            'department_name': ctIndustry,
            
        }
        addDepartment(post_data).then(res => {            
            if('end' == str){
                _this.setState({
                    industryBox: false,
                });
            }else if('next' == str){
                _this.setState({
                    industryBox: false,
                    industryjobBox: true,
                });
            }
            message.success('「部门」新建成功', 2, () => {  
                _this.getPositionAuthorityList()          
                _this.getAllDepartment();
                _this.getPosToMenu();
            });            
        })
    };
     // 新建岗位职务-部门列表
     getAllDepartment() {
        let _this = this;
        let { auth_token  } = _this.state;

        let post_data = {
            auth_token:cookie.load('station_console_setting_web_login').auth_token,  
        }

        getDepartmentList(post_data).then(res => {
            _this.setState({
                industryList: res.data,
            });
        })
    }
   
   
    // 点击 修改岗位
    // wwwww
    editPosition = (id,name,auth,menuid) => {
        console.log('修改岗位',id,name,auth,menuid)
        this.getPosToMenu2();
        // 获取默认值
        
        this.getAllDepartment();
        this.setState({
            industryjobBox:true,
            editId:id,
            type:'2',//修改
            activeName:name,
            activeAuth:auth,
            menuid:menuid?menuid.split(','):''
            
        },()=>{
            console.log(this.state.menuid)
        })
    }

    // 点击 删除岗位
    delPosition = (id) => {
        console.log('删除岗位',id)
        this.setState({
            isDelPosition:true,
            delId:id
        })
    }
    // 点击 修改 部门
    editPart = (id,name) => {
        console.log('修改部门',id,name)
        this.setState({
            editName:name,
            isModalVisibleEdit:true,
            delId:id
        })
    }
    // 点击 删除部门
    delPart = (id) => {
        console.log('删除部门',id)
        this.setState({
            isDelDepart:true,
            delId:id
        })
    }
    deldepart = () => {
        let post_data = {
            auth_token:cookie.load('station_console_setting_web_login').auth_token,  
            depart_id:this.state.delId
        }

        delDepartment(post_data).then(res => {
            if(res.code==0){
                this.setState({
                    isDelDepart:false
                })
                message.success('该部门删除成功！',2,()=>{
                    window.location.reload()
                })
            }
        })
    }
    // 确定wwwww
    delposition2 = () => {
        let post_data = {
            auth_token:cookie.load('station_console_setting_web_login').auth_token,  
            position_id:this.state.delId
        }
        delPosition(post_data).then(res => {
            if(res.code==0){
                this.setState({
                    isDelPosition:false
                })
                message.success('该岗位/职务删除成功！',2,()=>{
                    window.location.reload()
                })
            }
        })

    }

    // 新建部分

    // Modol新建部门--ok
    handleOk = () => {
        console.log('222')
        console.log(this.state.new_depart_name)
        let post_data = {
            'auth_token':cookie.load('station_console_setting_web_login').auth_token,
            'department_name':this.state.new_depart_name
        }
        addDepartment(post_data).then(res => {
            if(res.code == 0){
                message.success('新建部门成功！',2,window.location.reload())
                this.setState({
                    isModalVisible:false
                })

            }
        })
        
    };
    // 新建岗位/职务 提交
    // wwwww
    checkJobBoxOk(e) {
        console.log(e);
        let _this = this;
        let { auth_token, jobNameCreate, industryCreate, jobType, ah_check_list   } = _this.state;

        let post_data = {
            auth_token:cookie.load('station_console_setting_web_login').auth_token,
            'position_name': jobNameCreate,
            'depart_id': industryCreate,
            // 'role_type': jobType,
            'menu_id': ah_check_list.join(','),
        }
        console.log(post_data)
        addPosition(post_data).then(res => {
            _this.setState({
                checkJobBox: false,
            })
            message.success('岗位/职务/权限新建成功', 2,()=>{
                 window.location.reload()
            });
        })
    }
    // 
    onChangeMore=list =>{
        this.setState({
            checkedList:list,
            
            // checkAll:list.length === this.state.authData.length
        },()=> {
            console.log(this.state.checkedList,this.state.checkAll)
        // setCheckedList(list);
        // setIndeterminate(!!list.length && list.length < plainOptions.length);
        // setCheckAll(list.length === plainOptions.length);
        })
    }
    // Modol取消新建部门
    handleCancel = () => {
        this.setState({
            isModalVisible:false
        })
    };

   

    // 编辑部份

    // Modol部门--ok
    handleOkEdit = () => {
        let post_data = {
            'auth_token':cookie.load('station_console_setting_web_login').auth_token,
            'depart_id':this.state.delId,
            'department_name':this.state.newdepartname,
            'opt_type':2
        }
        console.log(post_data)
        updDepartment(post_data).then(res => {
            if(res.code == 0){
                message.success('修改部门名称成功！',2,()=> {
                    window.location.reload()
                })
            }
        })
        this.setState({
            isModalVisibleEdit:false
        })
    };
   
    // Modol岗位职务--ok
    handleOkEdit2 = () => {
        this.setState({
            isModalVisibleEdit2:false
        })
    };
    // Modol取消岗位职务
    handleCancelEdit2 = () => {
        this.setState({
            isModalVisibleEdit2:false
        })
    };
    
    // 点击进入编辑状态。。传对应ID
    editCard = (id) => {
       
        this.setState({
            active:id,
            activeStatus:2
        },()=>{
           console.log
           ('当前点击的',this.state.active)
        })
    }
    // 点击取消编辑状态
    editCardClose = () => {
        this.setState({
           activeStatus:1
        })
    }

    newdepartnameIpt = e => {
        
        this.setState({
            new_depart_name:e.target.value
        })
    }

    render(){
        const {ah_list,industryList,isDelDepart,ctIndustry,ah_check_name,isDelPosition,newdepartname,
            industryjobBox,authData,jobNameCreate,checkJobBox,jobType,industryBox,partData,new_depart_name,cardData,
            industryCreate,industryCreateName,positionData,dataSource,department,isModalVisibleEdit,isModalVisibleEdit2,
            activeStatus,active,editName,type,newPositionName,activeAuth,activeName,menuid} = this.state
        return (
            <div id="ContentMainList" className="autherCom-con">
                <Row>
                    <Col span={24}>
                        <BreadcrumbNav />
                    </Col>
                    <Col span={24} style={{margin:'10px'}}>
                        <div className="tipss">
                            <span className="blue"></span>
                            <span>组织架构</span>
                            
                        </div>
                    </Col>
                    <Col span={24} >
                        <Button onClick={ () => { this.setState({ industryBox: true,ctIndustry:'' ,type:1 , ctIndustry:''})}} type='primary' style={{color:'#fff',float:'left',marginLeft:'40px',marginRight:'20px',padding:'10px',lineHeight:'3px'}}>
                            新建部门
                        </Button>
                        <Button onClick={ () => { this.setState({ industryjobBox: true,jobNameCreate:'',industryCreate:'',type:'1' }, () => {
                            this.getPosToMenu();
                            this.getAllDepartment();
                        }) }} type='primary' style={{color:'#fff',float:'left',marginRight:'40px',padding:'10px',lineHeight:'3px'}}>
                            新建岗位/职务 
                        </Button>
                    </Col>
                    <Col span={24} style={{margin:'10px'}}>
                        <div className="borders">

                        </div>
                    </Col>
                    <Col span={6} style={{margin:'10px'}}>
                        <span className="label">所属部门：</span>
                        <Select  size="small" placeholder="请选择用户所属部门" labelInValue allowClear onChange={this.selected.bind(this)}>
                            {/* <Option value="12">设备新增</Option>
                            <Option value="22">设备维护</Option>
                            <Option value="32">设备删除</Option>
                            <Option value="42">工单新增</Option> */}
                            {partData.map( (item,index) => 
                                <Option value= {item.id} >{item.name}</Option>
                            )}
                        </Select>
                    </Col>
                    <Col span={5} style={{margin:'10px'}}>
                         <span className="label">岗位职务</span>
                        <Select  size="small" placeholder="请选择用户所属部门" labelInValue  allowClear onChange={this.selected2.bind(this)}>
                            {positionData.map( (item,index) => 
                                <Option value= {item.id} >{item.name}</Option>
                            )}
                        </Select>
                    </Col>
                    <Col span={10} style={{margin:'10px'}}>
                        <Button onClick={this.searchBtn.bind(this)} type='primary' style={{width:'100px'}}>查询</Button>
                        <Button onClick={this.clearBtn.bind(this)} style={{width:'100px',marginLeft:'20px'}}>重置</Button>
                    </Col>
                    <Col span={24} style={{margin:'10px'}}>
                        <div className="borders2">

                        </div> 
                    </Col>
                    <Col span={24} style={{margin:'10px',padding:'10px'}}>
                        {cardData.map((item,index) => (
                            <Card style={{ width:'80%' ,margin:'20px'}}  >
                                <div>
                                    <span className="editName">{item.dep_name}</span> 
                                    {activeStatus == 2&&active==item.dep_id? 
                                        <div style={{display:'inline-block'}}><span style={{color:'#0054FE'}}><EditOutlined onClick={this.editPart.bind(this,item.dep_id,item.dep_name)} style={{margin:' 0 10px',}} /><DeleteOutlined onClick={this.delPart.bind(this,item.dep_id)} /></span><button className="singEdit" onClick={this.editCardClose.bind(this)}>关闭编辑状态</button></div>
                                    :<button className="singEdit" onClick={this.editCard.bind(this,item.dep_id)}>打开编辑状态</button>
                                    }
                                    
                                    <span style={{float:'right',color:'#817F7F',fontSize:'12px',lineHeight:'30px'}}>{item.dep_add_time}</span>
                                    
                                </div>
                                <Row >
                                {item.pos_data&&item.pos_data!=[]?
                                    
                                    item.pos_data.map((el,i)=>(
                                        <Col span={7} style={{background:'#f8f8f8',border:'1px solid #f8f8f8',margin:'10px',padding:'10px'}}>
                                            <div className='jobs'>{el.pos_name}
                                                {activeStatus == 2&&active ==item.dep_id ?<div style={{display:'inline-block'}}><span style={{color:'#0054FE'}}><EditOutlined onClick={this.editPosition.bind(this,el.pos_id,el.pos_name,el.pos_to_menu,el.menu_id)} style={{margin:'0 10px'}} /><DeleteOutlined onClick={this.delPosition.bind(this,el.pos_id)} /></span></div>:null}
                                            </div>
                                            
                                            <div style={{lineHeight:'20px',height:'20px',marginTop:'10px'}}>当前权限</div>
                                            <div style={{marginTop:'10px'}}>
                                                <span className="singleOne">
                                                {el.pos_to_menu}
                                                </span>
                                                
                                                
                                            </div>
                                        </Col>
                                    ))
                                :null
                                }</Row>
                            
                        </Card>
                        ))}
                    </Col>

                </Row>
                
                
                {/* 新建部门 */}
                <div className="create-industry-box">
                    <Modal
                        width={ 447 }
                        destroyOnClose={ true }
                        getContainer={ false }
                       
                        closeIcon={ <img src={require("../../../assets/img/gb.png")}></img> }
                        visible={ industryBox }
                        onOk={this.industryOk.bind(this)}
                        onCancel={ () => { this.setState({ industryBox: false, })} }
                        onOk={this.industryOk.bind(this)}
                        footer={[
                            <Button key="back" onClick={ () => { this.setState({ industryBox: false, })} }>取消</Button>,
                            <Button key="create" type="primary"  onClick={this.industryOk.bind(this, 'end')}>新建部门</Button>,
                            <Button key="next"   onClick={this.industryOk.bind(this, 'next')}>新建(部门)并创建(岗位/职务)</Button>,
                        ]}
                        >
                        <div className="title">新建「部门」</div>
                        <div className="dy">
                            <span className="label">部门名称</span>
                            <Input placeholder="请输入" value={ ctIndustry } onChange={ (e) => { this.setState({ ctIndustry: e.currentTarget.value })} }/>
                        </div>
                    </Modal>
                </div>
                {/* 新建/修改岗位/职务/权限 弹窗 */}
                {/* wwwww */}
                <div className="create-industryjob-box">
                    <Modal
                        width={ 447 }
                        destroyOnClose={ true }
                        getContainer={ false }
                        title="Basic Modal"
                        closeIcon={ <img src={require("../../../assets/img/gb.png")}></img> }
                        visible={ industryjobBox }
                        onOk={type==1?this.industryjobBoxOk.bind(this):this.editOk.bind(this)}
                        onCancel={ () => { this.setState({ industryjobBox: false, })} }
                        okText={type==1?'新建':'修改'}
                        cancelText="放弃"
                        footer={[
                            <Button key="back" onClick={ () => { this.setState({ industryjobBox: false, })} }>放弃</Button>,
                            <Button key="create" type="primary"  onClick={ type==1?this.industryjobBoxOk.bind(this):this.editOk.bind(this)}>{type==1?'新建':'修改'}</Button>,
                        ]}
                        >
                        
                        <div className="title">{type==1?'新建':'修改'}「岗位/职务/权限」</div>
                        
                            {type == 1?
                                <div className="name">
                                    <div className="detail">
                                        <span className="label">岗位/职务名称</span>
                                        <Input placeholder="请输入" value={ jobNameCreate } onChange={ (e) => { this.setState({ jobNameCreate: e.currentTarget.value })} } />
                                    </div>
                                    <div className="detail">
                                        <span className="label">归属部门</span>
                                        <Select className="cj" placeholder="请选择" value={ industryCreate } onChange={ (val, option) => { 
                                                    this.setState({ 
                                                        industryCreate: val,
                                                        industryCreateName: option.children
                                                    })}
                                            } allowClear>
                                            { industryList.map((val) => ( <Option value={ val.id } key={ val.id }>{ val.name }</Option> ))}
                                        </Select>
                                        <Button type="text" style={{margin:'10px',color:'#2F3CF2'}} className="label2" onClick={ () => { this.setState({ industryBox: true, industryjobBox:false ,ctIndustry:''})}}>+新建部门</Button>
                                    </div>
                                </div>
                                :
                                <div className="name" >
                                    <div style={{margin:'10px',}} >
                                        <span >原岗位/职务名称：{activeName}</span>
                                        
                                    </div>
                                    <div style={{margin:'10px'}}>
                                        <span>修改为：<Input style={{display:'inline-block',width:'250px'}}  placeholder="请输入" value={ newPositionName } onChange={ (e) => { this.setState({ newPositionName: e.currentTarget.value })} } /></span>
                                        
                                    </div>
                                    <div style={{margin:'5px'}}> 
                                        <p style={{margin:'5px'}}>当前权限：</p>
                                        <span style={{marginLeft:'25px',display:'inline-block'}}>{activeAuth}</span>
                                    </div>
                                </div>

                            }
                        

                      
                        <div className="authority-check">
                            <div className="label">{type==1?'岗位/职务权限':'修改为'}</div>
                            {/* <div className="list">
                                { ah_list.map((val, ind) => (
                                   <div className="ay-wrap" key={ ind }>
                                        <Checkbox className="ck-one"  onChange={this.onCheckAllChange.bind(this, ind)} >{ val.menu_name }</Checkbox>
                                        { val.children ?
                                             <CheckboxGroup className="ck-two" value={ val.ck_lt }  onChange={this.onChangeget.bind(this, ind) }>
                                                { val.children.map((vl, index) => (
                                                    <Checkbox   value={ vl.id } key={index }>{ vl.menu_name }</Checkbox>
                                                ))}
                                            </CheckboxGroup> : null 
                                        }
                                    </div>
                                ))}

                            </div> */}
                            <div className="list">
                                { ah_list.map((val, ind) => (
                                   <div className="ay-wrap" key={ ind }>
                                        <Checkbox className="ck-one" defaultChecked={type ==1?'':this.state.menuid.includes(val.id)}  onChange={this.onCheckAllChange.bind(this, ind)} >{ val.menu_name }</Checkbox>
                                        { val.children ?
                                             <CheckboxGroup className="ck-two" value={val.ck_lt}   onChange={this.onChangeget.bind(this, ind) }>
                                                { val.children.map((vl, index) => (
                                                    <Checkbox   value={ vl.id }  >{ vl.menu_name }</Checkbox>
                                                ))}
                                            </CheckboxGroup> : null 
                                        }
                                    </div>
                                ))}

                            </div>
                        </div>
                    </Modal>
                </div>

                {/* 核对新建【岗位、职务、权限弹窗】 */}
                <div className="check-job-box">
                    <Modal
                        width={ 447 }
                        destroyOnClose={ true }
                        getContainer={ false }
                        
                        closeIcon={ <img src={require("../../../assets/img/gb.png")}></img> }
                        visible={ checkJobBox }
                        onOk={this.checkJobBoxOk.bind(this)}
                        onCancel={ () => { this.setState({ checkJobBox: false, }) }}
                        okText="确认无误，提交"
                        cancelText="我再检查一下"
                        >
                        <div className="title">{type == 1?'新建':'修改'}「岗位/职务/权限」信息：</div>
                        <div className="name">
                            <span>岗位/职务名称：{type==1?  jobNameCreate : newPositionName}</span>
                            <span>所属部门：{ industryCreateName }</span>
                        </div>
                        <div className="ay">
                            <div className="label">岗位/职务权限</div>
                            <div className="list">
                                { ah_check_name ? ah_check_name.map((val, ind) => ( <span key={ ind }>{ val }{ ah_check_name.length -1 != ind ? '；' : null }</span>)) : null }
                            </div>
                        </div>
                    </Modal>
                </div>
                <Modal title="修改部门" visible={isModalVisibleEdit} onOk={this.handleOkEdit.bind(this)} onCancel={()=> {this.setState({isModalVisibleEdit:false})}}>
                    <div>
                        <span>原部门名称：{editName}</span>
                        <Input placeholder="请输入部门名称" value={newdepartname} onChange={ (e) => {this.setState({ newdepartname: e.currentTarget.value })}} />
                    </div>
                </Modal>
                
                <Modal title="修改岗位/职位" visible={isModalVisibleEdit2} width={800}  onOk={this.handleOkEdit2.bind(this)} onCancel={this.handleCancelEdit2.bind(this)}>
                    <div style={{width:'100%',height:'60px'}}>
                        <div style={{width:'45%',float:'left'}}>
                            <span>岗位/职务名称：</span>
                            <Input placeholder="请输入部门名称" style={{width:'200px'}} />
                        </div>
                        <div style={{width:'45%',float:'right'}}>
                            <span>所属部门：</span>
                            <Select  size="small" placeholder="所属部门"  allowClear>
                                <Option value="12">设备新增</Option>
                                <Option value="22">设备维护</Option>
                                <Option value="32">设备删除</Option>
                                <Option value="42">工单新增</Option>
                            </Select>
                        </div>

                    </div>
                    <div style={{width:'100%',height:'40px'}}>
                        <span>当前权限：</span>
                        <span>CCCCCCC</span>
                        <span>CCCCCCC</span><span>CCCCCCC</span><span>CCCCCCC</span><span>CCCCCCC</span><span>CCCCCCC</span><span>CCCCCCC</span>
                    </div>
                    <div style={{width:'100%',height:'40px'}}>
                        <span>修改为： </span>
                    </div>

                </Modal>      
                {/* 删除部门 */}
                <Modal title="删除部门" visible={isDelDepart} onOk={ this.deldepart.bind(this) } onCancel={() => { this.setState({ isDelDepart: false, })}}>
                    <p>确定删除该部门吗？</p>
                </Modal>
                {/* 删除岗位 */}
                <Modal title="删除岗位/职务" visible={isDelPosition} onOk={ this.delposition2.bind(this) } onCancel={() => { this.setState({ isDelPosition: false, })}}>
                    <p>确定删除该岗位/职务吗？</p>
                </Modal>
            
            
            
            </div>
        )
    }
}

export default autherCom